<template>
  <div id="app">
    <h2>当前求和为:{{ sum }}</h2>
    <div>
      <select v-model="n">
        <option :value="1">1</option>
        <option :value="2">2</option>
        <option :value="3">3</option>
      </select>
      <button @click="add">+</button>
      <button @click="jian">-</button>
      <button @click="jishu">当前和为奇数再加</button>
      <button @click="wait">等一等再加</button>
    </div>
  </div>
</template>

<script>
export default {
  name: "App",
  data() {
    return {
      n: 1,
      sum: 0,
    };
  },
  methods: {
    add() {
      this.sum += this.n; //n是v-model里面用户输入的值
    },
    jian() {
      this.sum -= this.n;
    },
    jishu() {
      if (this.sum % 2) {
        this.sum += this.n;
      }
    },
    wait() {
      setTimeout(() => {
        this.sum += this.n;
      }, 500);
    },
  },

  components: {
    // HelloWorld,
    // Mounten,
  },
};
</script>

<style lang="css">
button {
  margin-left: 5px;
}
</style>